<template>
  <div v-if="data">
    <div id="mainsex" :style="{width:'110%',height:'400px',marginTop:'60px'}"></div>
  </div>
</template>

<script>
import * as echarts from 'echarts';
export default {
    name:'SexData',
    data(){
        return{
            data:null,
            url:'http://192.168.35.36:3005',
        }
    },
    created(){
        this.$axios.get(`${this.url}/totaldata/sex`).then(content=>{
            let arr=[]
            let man={}
            let woman={}
            man.value=content.data.data.man
            man.name='男生'
            woman.value=content.data.data.woman
            woman.name='女生'
            arr[0]=man
            arr[1]=woman
            this.data=arr

        }).then(()=>{
            var myChart = echarts.init(document.getElementById('mainsex'));
            window.onresize = function() {
            myChart.resize();
            }   
            myChart.setOption({
                title:{
                text:'男女比例'
                },
                series:[{
                    type:'pie',
                    data:this.data
                }]
            })        
        })
    },
}
</script>

<style lang="less" scoped>

</style>